<ion-header no-border>
  <ion-navbar>
    <ion-title>完工</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <ng-container *ngFor="let SP of codeList; let i = index">
    <div class="w12 pl10 pt10 pb10 font_gray">{{SP.EXTSKUNAME}}</div>
    <ng-container *ngFor="let v of SP.codes">
      <div class="w12 bgcolor_white">
        <ng-container *ngIf="v.lx=='1'">
          <div class="jl_input">
            <div class="jl_input_item bor_bottom">
              <span class="w04">外机编号</span>
              <input placeholder="" [(ngModel)]="v.code" (keydown)="shuRus($event,SP,i)" (blur)="sJs(v,SP,i)">
              <i class="fa fa-camera" (click)="scanWJBM(v,SP,i)"></i>
            </div>
          </div>
        </ng-container>
        <ng-container *ngIf="v.lx=='2'">
          <div class="jl_input">
            <div class="jl_input_item bor_bottom">
              <span class="w04">内机编号</span>
              <ng-container *ngIf="addCode">
                <input placeholder="必填" [(ngModel)]="v.code" (keydown)="shuRus($event,SP,i)" (blur)="sJs(v,SP,i)">
              </ng-container>
              <ng-container *ngIf="!addCode">
                <input placeholder=" " [(ngModel)]="v.code" (keydown)="shuRus($event,SP,i)" (blur)="sJs(v,SP,i)">
              </ng-container>
              <i class="fa fa-camera" (click)="scanNJBM(v,SP,i)"></i>
            </div>
          </div>
        </ng-container>
        <ng-container *ngIf="v.lx=='3'">
          <div class="jl_input">
            <div class="jl_input_item bor_bottom">
              <span class="w04">条码</span>
              <input placeholder="" [(ngModel)]="v.code" (keydown)="shuRus($event,SP,i)" (blur)="sJs(v,SP,i)">
              <i class="fa fa-camera" (click)="scanNJBM(v,SP,i)"></i>
            </div>
          </div>
        </ng-container>
      </div>
    </ng-container>
  </ng-container>

  <ng-container *ngIf="param.DESCRIPTION=='维修'">
    <div class="w12 pl10 pt10 pb10 font_gray">维修信息</div>
    <div class="w12 bgcolor_white">
      <ion-item class="w12 ">
        <ion-label class="w03 font_black_111 ">故障原因</ion-label>
        <ion-select [(ngModel)]="cacheFaultCause" interface="popover"
                    (ngModelChange)="loadMaintenancemMeasuresByFaultCause(cacheFaultCause)"
                    (click)="loadMaintenancemMeasuresByFaultCause(cacheFaultCause)">
          <ng-container *ngFor="let data of faultCause">
            <ion-option value="{{data}}">{{data}}</ion-option>
          </ng-container>
        </ion-select>
      </ion-item>

      <ion-item class="w12 ">
        <ion-label class="w03 font_black_111 ">维修措施</ion-label>
        <ion-select [(ngModel)]="WXCS" interface="popover">
          <ng-container *ngFor="let data of maintenancemMeasuresByFaultCause">
            <ion-option value="{{data.WXCS}}">{{data.WXCS}}</ion-option>
          </ng-container>
        </ion-select>
      </ion-item>
    </div>
  </ng-container>

  <div class="w12 pl10 pt10 pb10 font_gray">备注</div>
  <div class="w12 bgcolor_white">
    <div class="jl_input">
      <div class="jl_input_item pr15">
        <textarea class="w12 font_size_large" [(ngModel)]="bz"></textarea>
      </div>
    </div>
  </div>

  <div class="w12">
    <div class="w12 pl10 pt10 pb10 pr10 font_gray">
      费用列表
      <div class="fr">
        合计：
        <font class="font_red">￥{{ sum | money }}</font>
      </div>
    </div>
    <div class="w12 bgcolor_white">
      <div class="jl_form">
        <div class="jl_form_item bor_bottom" (click)="showMaterialModal()">
          <span class="w08">自费材料及费用列表</span>
          <span class="w04 tr">{{ materialCosts?.num || '无'}}</span>
          <i class="fa fa-angle-right"></i>
        </div>
      </div>
      <div class="w12 pt10 pb10 " *ngFor="let cost of materialCosts"><!--costs-->
        <span class="w12 font_size_standard">{{cost.PRODUCT_NAME}}</span>
        <span class="w08 font_red">￥{{cost.PRICE * 1}}</span><!--*cost.QUANTITY-->
        <span class="w04 tr font_gray">x {{cost.QUANTITY}}</span>
        <ion-item class="w12 " *ngIf="userInfo.GSCS==='5'">
          <ion-label class="w03 font_black_111 ">销售方式</ion-label>
          <ion-select [(ngModel)]="cost.FLFS" interface="popover">
            <ng-container *ngFor="let salesMethod of salesMethods">
              <ion-option value="{{salesMethod.KEY}}">{{salesMethod.VALUE}}</ion-option>
            </ng-container>
          </ion-select>
        </ion-item>
      </div>
      <div class="jl_form">
        <div class="jl_form_item bor_bottom" (click)="showGuaranteeMaterialModal()">
          <span class="w08">保修材料及费用列表</span>
          <span class="w04 tr">{{ guaranteeCosts?.num || '无'}}</span>
          <i class="fa fa-angle-right"></i>
        </div>
      </div>
      <div class="w12 pt10 pb10 " *ngFor="let cost of guaranteeCosts"><!--costs-->
        <span class="w12 font_size_standard">{{cost.PRODUCT_NAME}}</span>
        <span class="w08 font_red">￥{{cost.PRICE * 1}}</span><!--*cost.QUANTITY-->
        <span class="w04 tr font_gray">x {{cost.QUANTITY}}</span>
        <ion-item class="w12 " *ngIf="userInfo.GSCS==='5'">
          <ion-label class="w03 font_black_111 ">结算对象</ion-label>
          <ion-select [(ngModel)]="cost.settlementObject" interface="popover">
            <ng-container *ngFor="let settlementObject of settlementObjects">
              <ion-option value="{{settlementObject.KEY}}">{{settlementObject.VALUE}}</ion-option>
            </ng-container>
          </ion-select>
        </ion-item>
      </div>
    </div>
  </div>

  <div class="w12 pl10 pt10 pb10 font_gray">拍照</div>
  <div class="w12 bgcolor_white item pl15 pr15 pt10 pb10 mb10">
    <!--<select-pic *ngIf="!isApp" [max]="picMaxLength" [(fileObjList)]="picList"
                (addEvent)="imageUpload($event)"
                (deleteEvent)="delImage($event)"></select-pic>
    <select-pic-native *ngIf="isApp" [max]="picMaxLength" [(fileObjList)]="picList"
                       [mode]="'all'" (addImage)="imageUpload($event)"
                       (delImage)="delImage($event)"></select-pic-native>-->
    <image-picker class="fl up_img" [mode]="'all'"
                  [(ngModel)]="picList"
                  [upload]="true"
                  [isFileServer]="true"
                  (addEvent)="imageUpload($event)"
                  (delEvent)="delImage($event)"></image-picker>
  </div>

</ion-content>

<ion-footer>
  <div class="address_footer">
    <button class="w12 add_ljgm_btn" ion-button (click)="submit()">提交</button>
  </div>
</ion-footer>

<div class="hbcj_modal" style="top:-50px;" *ngIf="isClick" (click)="isClick = false">
  <div class="cart_main" (click)="$event.stopPropagation()">
    <ng-container *ngIf="BJ=='1'">
      <div class="w12 pl10 pr10 pt5 pb5 bgcolor_gray_444">客户信息</div>
      <div class="cart_main_userinfo">
        <span class="w06"><i class="fa fa-user-circle mr5"></i>嚯小花花</span>
        <span class="w06"><i class="fa fa-phone-square mr5"></i>13720353575</span>
        <div class="clear"></div>
        <span class="w06 mt10"><i class="fa fa-file-text mr5"></i>SO00008043</span>
        <span class="w06 mt10"><i class="fa fa-file-text mr5"></i>清洗</span>
        <span class="w12 mt10"><i class="fa fa-map-marker mr5"></i>湖北省武汉市江汉区新华路1610</span>
      </div>
      <div class="w12 pl10 pr10 pt5 pb5 bgcolor_gray_444">保修类型</div>
      <ul class="xzfzry">
        <li class="w04" (click)="safe = 0">
          <span [class.xuan]="safe == 0">保内</span>
        </li>
        <li class="w04" (click)="safe = 1">
          <span [class.xuan]="safe == 1">保外</span>
        </li>
        <li class="w04" (click)="safe = 2">
          <span [class.xuan]="safe == 2">延保</span>
        </li>
      </ul>
    </ng-container>
    <div class="w12 pl10 pr10 pt5 pb5 bgcolor_gray_444">
      已选物料
      <span class="fr" (click)="clearAll()">
        <i class="fa fa-trash-o mr5"></i>
        清空购物车
      </span>
    </div>
    <ul class="w12 cart_main_list">
      <ng-container *ngFor="let pros of allPros">
        <ng-container *ngFor="let pro of pros">
          <ng-container *ngIf="pro.QUANTITY>0">
            <li class="bor_bottom">
              <span class="w06">{{pro.PRODUCT_NAME}}</span>
              <span class="w03 tc">￥{{pro.PRICE | money}}</span>
              <div class="w03">
                <div class="num_p_m">
                  <button class="p" ion-button *ngIf="pro.QUANTITY>0" (click)="quantityChange(pro,0)">-</button>
                  <input type="number" type="number" [value]="pro.QUANTITY" disabled>
                  <button ion-button (click)="quantityChange(pro,1)">+</button>
                </div>
              </div>
            </li>
          </ng-container>
        </ng-container>
      </ng-container>
    </ul>
  </div>
</div>
